<template>
  <component :is="componentType" v-bind="info" />
</template>

 <script>
//  import { defineComponent, defineAsyncComponent, computed, ComputedRef } from 'vue';
 import BarChart from '../BarChart.vue';
 export default{
   props:{
     info: Object
   },
   data(){
     return {
      componentType:''
     }
   },
   components:{
      BarChart
   },
   mounted(){
     this.componentType=this.info?this.info.code:"";
   }
 }
  // lang="ts"
// import { defineComponent, defineAsyncComponent, computed, ComputedRef } from 'vue';

// // 图表
// const BarChart = defineAsyncComponent(() => import('../../charts/BarChart.vue'));
// const FunnelChart = defineAsyncComponent(() => import('../../charts/FunnelChart.vue'));
// const GaugeChart = defineAsyncComponent(() => import('../../charts/GaugeChart.vue'));
// const GraphChart = defineAsyncComponent(() => import('../../charts/GraphChart.vue'));
// const KChart = defineAsyncComponent(() => import('../../charts/KChart.vue'));
// const LineChart = defineAsyncComponent(() => import('../../charts/LineChart.vue'));
// const PieChart = defineAsyncComponent(() => import('../../charts/PieChart.vue'));
// const RadarChart = defineAsyncComponent(() => import('../../charts/RadarChart.vue'));
// const TreeChart = defineAsyncComponent(() => import('../../charts/TreeChart.vue'));
// // 形状
// const Circle = defineAsyncComponent(() => import('../../shapes/Circle.vue'));
// const Rectangle = defineAsyncComponent(() => import('../../shapes/Rectangle.vue'));
// const Triangle = defineAsyncComponent(() => import('../../shapes/Triangle.vue'));
// // 标题
// const Content = defineAsyncComponent(() => import('../../text-area/Content.vue'));
// const Headline = defineAsyncComponent(() => import('../../text-area/Headline.vue'));
// const NormalTitle = defineAsyncComponent(() => import('../../text-area/NormalTitle.vue'));
// const Subhead = defineAsyncComponent(() => import('../../text-area/Subhead.vue'));
// const StandardTable = defineAsyncComponent(()=>import('../../table/listTable/standardTable.vue'));
// // 地图
// const LineLayer = defineAsyncComponent(() => import('../../map/LineLayer.vue'));
// const MarkerCluster = defineAsyncComponent(() => import('../../map/MarkerCluster.vue'));

// export default defineComponent({
//   name: 'ComponentTransform',
//   props: {
//     info: Object
//   },
//   components: {
//     BarChart,
//     FunnelChart,
//     GaugeChart,
//     GraphChart,
//     KChart,
//     LineChart,
//     PieChart,
//     RadarChart,
//     TreeChart,
//     Circle,
//     Rectangle,
//     Triangle,
//     Content,
//     Headline,
//     NormalTitle,
//     Subhead,
//     LineLayer,
//     MarkerCluster,
//     StandardTable
//   },
//   setup(props) {
//     const componentType: ComputedRef = computed(() => props.info?.code || '');

//     return {
//       componentType
//     };
//   }
// });
</script>
